الواجهات الأمامية

ما هي الواجهات الأمامية؟

الواجهات الأمامية هي الجزء الظاهر من الموقع الإلكتروني الذي يراه المستخدم ويتفاعل معه والذي يحتوي على الألوان والأشكال والصور وغيرها مما يمكن للمستخدم النهائي رؤيته والتفاعل معه كالضغط عليه والكتابة عليه فهو الجزء المرئي من البرنامج.

مكوناتها

تتكون واجهة كل موقع من ثلاث أجزاء رئيسية:

1- العناصر: أي قائمة ما تحتويه الصفحة في هذا الموقع من نصوص, وأشكال, وصور, وجداول, وغيرها. ويتم كتابة هذه القائمة بلغة ( HTML ).

2- التخصيص: وهو تحديد لون, وحجم وخصائص كل عنصر من عناصر الصفحة. تُكتب عادةً بلغة ( CSS ).

3- التفاعلية: نعني بها ما يحدث عند الضغط على زر معين في الصفحة, أو كتابة المستخدم لجملة أو أن نطلب منه إدخال المعلومات ونحو ذلك مما يمثل الجزء التفاعلي من الصفحة. يُكتب عادةً بلغة ( JavaScript ).

مثال

لو أردنا إنشاء زر عندما يضغط عليه المستخدم يقوم بالترحيب به فستكون التقسيمة كالتالي:

HTML:

كما نشاهد نكتفي بهذا المكان بمجرد الإخبار بوجود زر.

<button onclick="tarheeb()">اضغط هنا للترحيب</button>

CSS:

هنا نحدد خصائص الزر مثل أن يكون لون الخلفية في الزر أزرقًا.

button {
    background-color: blue;
}

JavaScript:

هنا نحدد الوظيفة المطلوب من الزر أن يفعلها.

function tarheeb() {
    alert("مرحبًا بك!")
}